<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="./resources/jquery/jquery-3.1.0.min.js"></script>
<!-- <script type="text/javascript" src="./resources/layer/layer.js"></script> -->
<!-- <script type="text/javascript" src="./resources/layui/lay/lib/jquery.js"></script> -->

<link rel="stylesheet" type="text/css" href="./resources/layui/css/layui.css">
<script type="text/javascript" src="./resources/layui/layui.js"></script>
<script type="text/javascript" src="./resources/layui/lay/modules/element.js"></script>
<script type="text/javascript">
   $(function(){
	   //头像上传
	   layui.use('upload', function(){
	 	  layui.upload({
	 		    url: './common/upload/img',
	 		    type:'images',
	 		    method: 'post',
	 		    success: function(res){
	 		       if(res.code==200){
	 		    	   $("#userHeader").addClass("show");
	 		    	   $("#userHeader").css("display", "block");
	 			       $("#userHeader").attr("src","http://120.77.13.93:4869/"+res.data);
	 		       }
	 		       layer.msg(res.msg,{
	 		    		icon: 1,
	 		    		skin: 'demo-class',
	 		    		title :'信息',
	 		    	    area: ['300px', '160px'],
	 		    	    offset: 'rb'
	 		    	  });
	 		    }
	 	  });
	    });
	   //表单验证
	   layui.use(['form', 'layedit', 'laydate'], function(){
	 	  var form = layui.form(),layer = layui.layer,layedit = layui.layedit,laydate = layui.laydate;
	 	  //自定义验证规则
	 	  form.verify({
	 		userName:function(userName){
	 		    if(userName==null||userName==''){
	 		       return "用户名称不能为空";
	 		    }
	 		    if(userName=="123"){
	 		    	return "用户名已存在";
	 		    }
	 		},
	 		password: [/(.+){6,12}$/, '密码必须6到12位'],
	 	    repassword:function(repassword){
	 	    	if(repassword==null||repassword==''){
	 	    		return "请再次输入密码";
	 	    	}
	 	    	var password=$("input[name='password']").val();
	 	    	if(password!=repassword){
	 	    		return "两次输入密码不一致";
	 	    	}
	 	    }
	 	  });
	 	  //监听提交
	 	  form.on('submit(formDemo)', function(data){
	 	    layer.alert(JSON.stringify(data.field), {
	 	      title: '最终的提交信息'
	 	    })
	 	    return false;
	 	  });
	    });
	 });
</script>
</head>
<body>
  <div class="layui-form-item layui-form-text site-demo-upload">
    <label class="layui-form-label">用户头像</label>
	<div class="site-demo-upbar">
	    <input type="file" name="file" class="layui-upload-file">
	</div>
  </div>
  <div class="layui-form-item layui-form-text">
	  <img id="userHeader" src="./resources/cws/images/header.jpg">
  </div>
</body>
</html>